import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:yysk_app/model/search/mall_goods_spu_es_model.dart';
import 'package:yysk_app/model/tab_model.dart';
import 'package:yysk_app/pages/nft_pages/search/search_controller.dart';
import 'package:yysk_app/utils/colors.dart';
import 'package:yysk_app/utils/helper.dart';
import 'package:yysk_app/utils/js_tool.dart';
import 'package:yysk_app/widget/custom_app_bar2.dart';
import 'package:yysk_app/widget/empty_widget.dart';
import 'package:yysk_app/widget/image_asset_widget.dart';
import 'package:yysk_app/widget/lazy_network_image.dart';
import 'package:yysk_app/widget/refresh_and_scroll_widget.dart';
import 'package:yysk_app/widget/search_input_widget.dart';
import 'package:yysk_app/widget/tab_widget.dart';

class SearchPage extends GetView<SearchPageController> {
  static const path = '/SearchPage';
  SearchPage({super.key});
  final TextEditingController _searchController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    double top = MediaQuery.of(context).padding.top;
    return Scaffold(
      // backgroundColor: AppColors.backgroundColorBlack,
      body: Stack(
        children: [
          Positioned(
            top: 0,
            left: 0,
            right: 0,
            child: ImageAssetWidget(
              width: 375.px,
              height: 812.px,
              imageUrl: 'static/images/bg.png',
            ),
          ),
          Obx(() {
            return Container(
              padding: EdgeInsets.fromLTRB(0, top, 0, 0),
              child: Column(
                children: [
                  CustomAppBar2(
                    title: controller.labelName.value,
                    context: context,
                    textColors: AppColors.fontColor,
                  ),
                  // hiSpace(height: 10.px),
                  Container(
                    padding: EdgeInsets.only(left: 14.px, right: 14.px),
                    child: SearchInputWidget(
                      inputFormatters: 'num',
                      hint: '请输入关键词',
                      controller: _searchController,
                      showClose: controller.showClose.value,
                      onChanged: (value) {
                        if (value.isNotEmpty) {
                          if (!controller.showClose.value) {
                            controller.showClose.value = true;
                          }
                        } else {
                          controller.showClose.value = false;
                        }
                      },
                      onSearch: (value) {
                        if (value.isEmpty) {
                          controller.showClose.value = false;
                          _searchController.text = value;
                        }
                        controller.keyword.value = value;
                        controller.getList();
                      },
                      top: top,
                    ),
                  ),
                  controller.keyword.value == ''
                      ? Container(
                        width: context.width,
                        padding: EdgeInsets.only(
                          top: 39.px,
                          left: 14.px,
                          right: 14.px,
                        ),
                        child: Column(
                          mainAxisSize: MainAxisSize.max,
                          mainAxisAlignment: MainAxisAlignment.start,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            // Row(
                            //   mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            //   children: [
                            //     Text(
                            //       '搜索历史',
                            //       style: TextStyle(
                            //         fontSize: 16.px,
                            //         color: AppColors.fontColorGray99,
                            //         fontWeight: FontWeight.w400,
                            //       ),
                            //     ),
                            //     ImageAssetWidget(
                            //       imageUrl: 'static/images/search/clear.png',
                            //       width: 18.px,
                            //       height: 18.px,
                            //       fit: BoxFit.fitWidth,
                            //       alignment: Alignment.topCenter,
                            //     ),
                            //   ],
                            // ),
                            hiSpace(height: 4.px),
                            controller.hotWordsList.value.isEmpty
                                ? Column(
                                  mainAxisSize: MainAxisSize.max,
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    hiSpace(height: 84.px),
                                    Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.center,
                                      children: [
                                        Image(
                                          width: 174.px,
                                          height: 133.px,
                                          image: AssetImage(
                                            'static/images/no_data.png',
                                          ),
                                          fit: BoxFit.cover,
                                        ),
                                      ],
                                    ),
                                    hiSpace(height: 24.px),
                                    Text(
                                      '暂无数据~',
                                      style: TextStyle(
                                        fontSize: 12.px,
                                        color: AppColors.fontColorB2,
                                      ),
                                    ),
                                  ],
                                )
                                : _buildSearchHot(),
                          ],
                        ),
                      )
                      : Expanded(
                        child: Column(
                          children: [
                            (controller.type == 'reward'
                                ? hiSpace(height: 31.px)
                                : Container(
                                  padding: EdgeInsets.fromLTRB(
                                    12.px,
                                    18.px,
                                    12.px,
                                    0.px,
                                  ),
                                  child: TabWidget(
                                    isCurrentFontSize: 15,
                                    notCurrentFontSize: 15,
                                    tabColor: AppColors.fontColorGray99,
                                    value: controller.level.value,
                                    tabList: [
                                      TabModel(
                                        label: '亲密好友',
                                        code: '1',
                                        bySelf: true,
                                        child: _tabChildrenWidget(txt: '亲密好友'),
                                      ),
                                      TabModel(
                                        label: '扩列好友',
                                        code: '2',
                                        bySelf: true,
                                        child: _tabChildrenWidget(txt: '扩列好友'),
                                      ),
                                    ],
                                    onChanged: (val) {
                                      controller.changeTab(val);
                                    },
                                  ),
                                )),
                            Expanded(
                              child: Container(
                                padding: EdgeInsets.fromLTRB(
                                  12.px,
                                  0.px,
                                  12.px,
                                  0.px,
                                ),
                                child: RefreshAndScrollWidget(
                                  onRefresh: _handleRefresh,
                                  scrollController: controller.scrollController,
                                  itemBuilder:
                                      (item, index) =>
                                          controller.type == 'reward'
                                              ? _itemWidgetReward(item)
                                              : _itemWidget(item),
                                  itemCount:
                                      controller.type == 'reward'
                                          ? controller.friendRewardList.length
                                          : controller.friendList.length,
                                  items:
                                      controller.type == 'reward'
                                          ? controller.friendRewardList
                                          : controller.friendList,
                                  emptyText: '暂无数据~',
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                ],
              ),
            );
          }),
        ],
      ),
    );
  }

  Future<void> _handleRefresh() async {
    controller.getList();
    ();
    return;
  }

  _itemWidgetReward(item) {
    return Container(
      padding: EdgeInsets.all(10.px),
      margin: EdgeInsets.only(bottom: 8.px),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(10.px),
        border: Border.all(color: AppColors.backgroundColor.withOpacity(0.1)),
        color: AppColors.backgroundColorBlackLight,
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                SizedBox(
                  width: 150.px,
                  child: Text(
                    '${item.rewardDesc}',
                    style: TextStyle(
                      color: AppColors.fontColorGray99,
                      fontSize: 12.px,
                      overflow: TextOverflow.ellipsis,
                    ),
                    textAlign: TextAlign.left,
                  ),
                ),
                hiSpace(height: 10.px),
                SizedBox(
                  width: 140.px,
                  child: RichText(
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    text: TextSpan(
                      children: <TextSpan>[
                        TextSpan(
                          text: '${item.nickName}',
                          style: TextStyle(
                            color: AppColors.fontColor,
                            fontSize: 12.px,
                          ),
                        ),
                        TextSpan(
                          text:
                              ' (${item.userTel.substring(item.userTel.length - 4)})',
                          style: TextStyle(
                            color: AppColors.fontColorGray99,
                            fontSize: 12.px,
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              SizedBox(
                width: 150.px,
                child: Text(
                  '${item.rewardAmount}',
                  style: TextStyle(
                    color: AppColors.fontColor,
                    fontSize: 14.px,
                    overflow: TextOverflow.ellipsis,
                  ),
                  textAlign: TextAlign.right,
                ),
              ),
              hiSpace(height: 10.px),
              Text(
                '${item.createTime}',
                style: TextStyle(
                  color: AppColors.fontColorGray99,
                  fontSize: 12.px,
                  overflow: TextOverflow.ellipsis,
                ),
                textAlign: TextAlign.right,
              ),
            ],
          ),
        ],
      ),
    );
  }

  _itemWidget(item) {
    return GestureDetector(
      onTap: () {},
      child: Container(
        padding: EdgeInsets.all(10.px),
        margin: EdgeInsets.only(bottom: 8.px),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(10.px),
          border: Border.all(color: AppColors.backgroundColor.withOpacity(0.1)),
          color: AppColors.backgroundColorBlackLight,
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            LazyImage(
              imageUrl: item?.avatarImg ?? '',
              width: 24.px,
              height: 24.px,
              boxFit: BoxFit.cover,
              borderRadius: 24.px,
            ),
            hiSpace(width: 10.px),
            SizedBox(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(
                    width: 140.px,
                    child: RichText(
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      text: TextSpan(
                        children: <TextSpan>[
                          TextSpan(
                            text: '${item.nickName}',
                            style: TextStyle(
                              color: AppColors.fontColor,
                              fontSize: 12.px,
                            ),
                          ),
                          TextSpan(
                            text:
                                ' (${item.userTel.substring(item.userTel.length - 4)})',

                            style: TextStyle(
                              color: AppColors.fontColorGray99,
                              fontSize: 12.px,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                  hiSpace(height: 10.px),
                  Row(
                    children: [
                      Container(
                        constraints: BoxConstraints(maxWidth: 100.px),
                        child: Text(
                          'ID：${item.showId}',
                          style: TextStyle(
                            color: AppColors.fontColorGray99,
                            fontSize: 12.px,
                            overflow: TextOverflow.ellipsis,
                          ),
                          textAlign: TextAlign.left,
                        ),
                      ),
                      hiSpace(width: 6.px),
                      Container(
                        width: 44.px,
                        height: 18.px,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(2.px),
                          gradient: LinearGradient(
                            begin: Alignment.centerLeft,
                            end: Alignment.centerRight,
                            colors: [
                              item.isSm
                                  ? AppColors.fontColorStart00
                                  : AppColors.backgroundColorGreyF8,
                              item.isSm
                                  ? AppColors.fontColorEnd00
                                  : AppColors.backgroundColorGreyF8,
                            ],
                          ),
                        ),
                        child: Center(
                          child: Text(
                            item.isSm ? '已实名' : '未实名',
                            style: TextStyle(
                              fontSize: 12.px,
                              color:
                                  item.isSm
                                      ? AppColors.fontColorBlack12
                                      : AppColors.fontColor,
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
            hiSpace(width: 30.px),
            Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.end,
              children: [
                SizedBox(
                  width: 100.px,
                  child: Text(
                    '0.00',
                    style: TextStyle(
                      color: AppColors.fontColor,
                      fontSize: 14.px,
                      overflow: TextOverflow.ellipsis,
                    ),
                    textAlign: TextAlign.right,
                  ),
                ),
                hiSpace(height: 10.px),
                Text(
                  '${item.createTime}',
                  style: TextStyle(
                    color: AppColors.fontColorGray99,
                    fontSize: 12.px,
                    overflow: TextOverflow.ellipsis,
                  ),
                  textAlign: TextAlign.right,
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  _tabChildrenWidget({required String txt}) {
    return Container(
      constraints: BoxConstraints(minWidth: 72.px),
      height: 28.px,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(
            txt,
            style: TextStyle(
              fontWeight: FontWeight.w500,
              fontSize: 15.px,
              color: AppColors.fontColorSearch, // 注意：这里颜色必须是不透明的，否则会被覆盖
            ),
          ),
          Container(
            width: 16.px,
            height: 2.px,
            color: AppColors.fontColorSearch,
          ),
        ],
      ),
    );
  }

  _buildSearchHot() {
    return Container(
      padding: EdgeInsets.fromLTRB(0.px, 8.px, 0.px, 8.px),
      child: Wrap(
        direction: Axis.horizontal, // 水平方向
        spacing: 8, // 子元素之间的间距
        runSpacing: 8, // 行之间的间距
        children: [
          ...controller.hotWordsList.map(
            (item) => GestureDetector(
              onTap: () {
                _searchController.text = item;
                controller.keyword.value = item;
                controller.showClose.value = true;
                controller.getList();
                ();
              },
              child: Container(
                padding: EdgeInsets.fromLTRB(12.px, 4.px, 12.px, 4.px),
                decoration: BoxDecoration(
                  color: AppColors.backgroundColorGrey2,
                  borderRadius: BorderRadius.circular(20.px),
                ),
                child: Text(
                  '$item',
                  style: TextStyle(
                    fontSize: 12.px,
                    color: AppColors.fontColorSearchEE,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
